<template>
  <div class="container">
    <div class="header-content">
      <h3>权限申请结果</h3>
    </div>
    <div class="my-content">
      <div class="my-content-item" v-if="resultList">
        <template>
          <el-table
            max-height="450px"
            :data="resultList"
            border
            stripe
            style="width: 100%"
          >
            <el-table-column
              fixed=""
              prop="fileType"
              label="录入权限类型"
              width="220"
            >
            </el-table-column>
            <el-table-column prop="managerName" label="处理人" width="120">
            </el-table-column>
            <el-table-column prop="managerPhone" label="处理人联系方式" width="120">
            </el-table-column>
            <el-table-column
              prop="status"
              label="处理状态"
              width="120"
            ></el-table-column>
            <el-table-column label="处理结果" width="120">
              <template slot-scope="scope">
                <i
                  v-if="scope.row.result == '已通过'"
                  class="el-icon-circle-check"
                ></i>
                <i
                  v-if="scope.row.result == '不通过'"
                  class="el-icon-circle-close"
                ></i>
                <span style="margin-left: 10px">{{ scope.row.result }}</span>
              </template>
            </el-table-column>
            <el-table-column label="备注" width="120">
              <template slot-scope="scope">
                <el-popover trigger="hover" placement="top">
                  <p>
                    {{ scope.row.remark ? scope.row.remark : "暂无备注信息" }}
                  </p>
                  <div slot="reference" class="name-wrapper">
                    <el-tag size="medium">查看备注</el-tag>
                  </div>
                </el-popover>
              </template>
            </el-table-column>
            <el-table-column label="申请时间" width="200"
              ><template slot-scope="scope">
                <i class="el-icon-time"></i>
                <span style="margin-left: 10px">{{
                  scope.row.createTime
                }}</span>
              </template></el-table-column
            >
          </el-table>
        </template>
      </div>
      <div class="my-content-item" v-else>
        <el-empty description="您还没有申请过档案录入权限！"></el-empty>
      </div>
    </div>
  </div>
</template>
      </div>
    </div>
  </div>
</template>

<script>
import { getFileWritePermissionApplyResult } from "@/api";
export default {
  data() {
    return {
      resultList: [], //档案录入权限申请处理情况
    };
  },
  created() {
    this.getPermissionApplyResult();
  },
  methods: {
    async getPermissionApplyResult() {
      let res = await getFileWritePermissionApplyResult();
      if (res.code == 0) {
        this.resultList = res.data;
      } else {
        this.resultList = null;
      }
    },
  },
};
</script>

<style lang="less" scoped>
.container {
  background: #f0f2f5;
  padding: 10px;
  display: flex;
  align-items: center;
  flex-direction: column;
  .header-content {
    width: 70%;
    border-bottom: 1px solid rgb(217, 212, 212);
    text-align: center;
    border-radius: 10px 10px 0px 0px;
    background: rgb(255, 255, 255);
  }
  .my-content {
    height: 500px;
    padding-bottom: 20px;
    border-radius: 0px 0px 10px 10px;
    background: rgb(255, 255, 255);
    width: 70%;
    .my-content-item {
      padding: 15px;
    }
  }
}
</style>